<template>
  <div class="detail">
    <el-form size="mini" label-width="140px">
      <el-form-item label="后台单号">
        <span>{{ order.xmbzNo }}</span>
      </el-form-item>
      <el-form-item label="平台单号">
        <span>{{ order.platformDetailId }}</span>
      </el-form-item>
      <el-form-item label="订单状态">
        <span>{{ order.statusName }}</span>
      </el-form-item>
      <el-form-item label="商品明细" v-if="order.orderDetailVOS">
        <span v-for="(detail, index) in order.orderDetailVOS" :key="index" class="goods-item">
          <span>{{detail.goodsName}}</span>
          <span class="c-red">({{ detail.goodsSpecs }}，{{ detail.num }})</span>
        </span>
      </el-form-item>
      <el-form-item label="客服备注">
        <span class="c-red">{{ order.customerServiceNotes }}</span>
      </el-form-item>
      <el-form-item label="异常反馈">
        <span class="c-red">{{ order.abnormalContent }}</span>
      </el-form-item>
      <el-form-item label="下单时间">
        <i class="el-icon-time mr-5"></i>
        <span>{{ order.orderTime }}</span>
      </el-form-item>
      <el-form-item label="下单人">
        <span>{{ order.bookerName }}</span>
      </el-form-item>
      <el-form-item label="下单号码">
        <span>{{ order.bookerPhone }}</span>
      </el-form-item>
      <el-form-item label="收货人">
        <span>{{ order.receiverName }}</span>
      </el-form-item>
      <el-form-item label="收货号码">
        <span>{{ order.receiverPhone }}</span>
      </el-form-item>
      <el-form-item label="配送员">
        <span>{{ order.delivery }}</span>
      </el-form-item>
      <el-form-item label="配送地址">
        <i class="el-icon-location mr-5"></i>
        <span>{{ order.receiverAddress }}</span>
      </el-form-item>
      <el-form-item label="配送时间">
        <i class="el-icon-time mr-5"></i>
        <span>{{ order.deliveryStartTime }}</span>
      </el-form-item>
      <el-form-item label="城市">
        <span>{{ order.deptName }}</span>
      </el-form-item>
      <el-form-item label="渠道">
        <span>{{ order.channelName }}</span>
      </el-form-item>
      <el-form-item label="分仓">
        <span>{{ order.branchWarehouse }}</span>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  props: {
    order: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {

    };
  },
};
</script>
<style lang="scss" scoped>
.detail {
  .goods-item {
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    margin-right: 10px;
    margin-bottom: 5px;
    line-height: 24px;
    display: inline-block;
  }
  .el-form-item {
  }
}
</style>